<script lang="ts">
  export default {
    name: 'Apparel',
  };
</script>

<script setup lang="ts">
  import { computed, onMounted, ref, unref } from 'vue';
  import { showConfirmDialog, showToast, showLoadingToast, closeToast } from 'vant';
  import { useRouter } from 'vue-router'
  import API_BANNER from '@/apis/banner';

  import img1 from '@/assets/shop/apparel1.avif'
  import img2 from '@/assets/shop/apparel2.avif'
  onMounted(() => {

  });
  let router = useRouter()
  let list = ref([
    {
      text: 'Cloud Nine Hoodie',
      price: '$90.00',
      img: img1,
      id: 1
    },
    {
      text: 'Zebra Blend T-Shirt',
      price: '$45.00 – $50.00',
      img: img2,
      id: 2
    },])
</script>

<template>
  <div>
    <Shop_headers></Shop_headers>
    <div class="shopContainer">
      <div class="category">Apparel</div>
      <Goods_list :filteredProducts="list"></Goods_list>
    </div>
    <Shop_footer></Shop_footer>
  </div>
</template>

<style lang="less" scoped>
  .category {
    margin: 26px 0;
    font-size: 32px;
    font-weight: 600;
  }
</style>